<template>
  <div></div>
</template>

<script lang="ts" setup>
import { useStageStore } from '@/store/stage';

// watch(active, () => {
//   if (condition) {
//   } else {
//   }
// });
interface IProps {
  data: any;
}
const props = withDefaults(defineProps<IProps>(), {});
const { cimInstance } = window;
const stageStore = useStageStore();
const zoomConfig = { range: 200, heading: (45 / 180) * Math.PI, pitch: (-30 / 180) * Math.PI };

function layerLocation(layer: any) {
  cimInstance.api.zoomToLayer(layer.id, zoomConfig);
}
onMounted(() => {
  layerLocation(stageStore.layerData);
  cimInstance.api.virtualModel({
    layerNames: [props.data.id],
    color: [1, 1, 1, 1],
    enabled: true,
    outlineWidth: 5,
    visibleEdgeColor: '#ff9600',
    showGlow: true,
    edgeGlow: 0.5,
  });
});

onBeforeUnmount(() => {
  cimInstance.api.virtualModel({});
});
</script>

<style lang="less" scoped></style>
